<template>

    <mi-list-page>

        <free-dist-reward />

        <mi-table :list="list" max-height="calc(100vh - 210px - 54px)">
            <template #topBar>
                <mi-top-bar
                    :data="topToolbar"
                >
                </mi-top-bar>
            </template>

            <template #audit="{row}">
                <el-tag type="warning" v-if="row.audit_status == 0">未审核</el-tag>
                <el-tag type="success" v-else-if="row.audit_status == 1">已通过</el-tag>
                <el-tag type="info" v-else-if="row.audit_status == -1">已拒绝</el-tag>
            </template>

        </mi-table>

    </mi-list-page>

    <store-manager-edit />

    <store-mananger-audit />

    <mi-dialog v-model="detail.show" title="会员信息">
        <user-detail :id="detail.info?.user_id" />
    </mi-dialog>

</template>

<script setup lang="ts">

import {getCurrentInstance, onBeforeMount, onUpdated, provide, reactive, ref} from "vue"
import {makeModelAuth} from "@/utils/auth";
import global from "@/dict/global";
import {useRoute} from "vue-router";
import List from "@/model/list";
import Edit from "@/model/edit";
import {FormInstance} from "element-plus";
import Search from "@/model/search";
import StoreManagerEdit from "@/views/store/storeManagerEdit.vue";
import StoreManangerAudit from "@/views/store/storeManangerAudit.vue";
import UserDetail from "@/views/site/user/userDetail.vue";
import FreeDistReward from "@/views/store/components/FreeDistReward.vue";

const route = useRoute()
const opOptions = global.opOptions

const {proxy} = getCurrentInstance() as any
const tdWidth = global.tdWidth
const cateOptions = ref([])
const auth = makeModelAuth('store.storeManager')

const tabChange = (name: string) => {
    // 添加查询条件
    list.where.delete = name
    list.reload(1)
}

// toolbar 事件
const topToolbar = [
    {
        auth: auth.add,
        type: 'success',
        icon: 'Plus',
        title: '新增',
        event: async (ids:Array<number>) => {
            edit.info = {}
            edit.show = true
        }
    },
    // {
    //     auth: auth.del,
    //     title: '删除',
    //     type: 'danger',
    //     icon: 'Delete',
    //     event: (ids:any) => {
    //         list.del({
    //             url: `/${auth.del}`,
    //             ids: ids
    //         })
    //     }
    // },
]

const lineToolbar = [
    {
        auth: auth.edit, title: '编辑', event: (row:any) => {
            edit.info = row
            edit.show = true
        }
    },
    {
        auth: auth.edit, title: '审核', event: (row:any) => {
            audit.info = row
            audit.show = true
        }
    },
    {
        auth: auth.edit, title: '详情', event: (row:any) => {
            detail.info = row
            detail.show = true
        }
    },
    // {
    //     auth: auth.del, title: '删除', type: 'del', event: (row:any) => {
    //         list.del({
    //             url: `/${auth.del}`,
    //             ids: [row.id]
    //         })
    //     }
    // },
]

const list = reactive(new List({
    where: {},
    url: `/${auth.index}`,
    columns:[
        {name: "select", type:'selection'},
        {name: "id", title:'ID', width:tdWidth.id},
        {name: "image", title:'店铺图片', type: 'image'},
        {name: "title", title:'店铺名称'},
        {name: "realname", title:'店长姓名'},
        {name: "mobile", title:'手机号'},
        {name: "payTimeStr", title:'付款'},
        {name: "audit_status", title:'审核', type:'slot', slot:'audit'},
        // {name: "status", title: "状态", width: tdWidth.switch, type:"switch", align: "center"},
        {title: "操作", type:'toolbar',toolbar:lineToolbar},
    ]
}))

const edit = reactive(new Edit({}))
const audit = reactive(new Edit({}))
const detail = reactive(new Edit({}))

const searchRef = ref<FormInstance>()
const search = reactive(new Search({
    list:list,
}))

const exportOut = reactive(new Edit({}))



provide("list", list)
provide("edit", edit)
provide("audit", audit)
provide("detail", detail)


</script>

<style scoped>

</style>
